﻿var contBuilder = {
	_editBut : new Object,
	initialized: false,
	isDesButBind: false,
	isBlockShow: false,
	isBgShow: false,
	isHdShow: false,
	
	setBaseLoyout : function(evt, classNam) {
		$('content').childElements().each(function(tis) {
			tis.remove();
		});
		switch(classNam){
			case 'v_1_1':
				$('content').insert(Builder.node('div', {id:'cont_v_1', style:'width:482px; height:894px; float:left', className:'box'}) );
				$('content').insert(Builder.node('div', {id:'cont_v_2', style:'width:482px; height:894px; float:left', className:'box'}));
				$('content').setStyle('height:900px');
				break;
			case 'v_2_1' :
				$('content').insert(Builder.node('div', {id:'cont_v_1', style:'width:642px; height:894px; float:left;', className:'box'}));
				$('content').insert(Builder.node('div', {id:'cont_v_2', style:'width:321px; height:894px; float:left;', className:'box'}));
				$('content').setStyle('height:900px');
				break;
			case 'h_1_1':
				$('content').insert(Builder.node('div', {id:'cont_v_1', style:'width:970px; height:296px;', className:'box'}));
				$('content').insert(Builder.node('div', {id:'cont_v_2', style:'width:970px; height:594px;', className:'box'}));
				$('content').setStyle('height:900px');
				break;
		}
		
		$('content').select('div').each( function(elm){
			if(elm.empty()){
				this._mousemovefeedback(elm);
			}
		}.bind(this) );
	},
	
	getLayerBlocks:function(){
		var params = {};
		params['isGetLayerBlocks']='true';
		new Ajax.Request('layerBlocks.aspx', {
			parameters:params,
			method:'get',
			onLoading:function(){
				$('onLoadingDes').show();
			},
			onSuccess:function(resp){
				$('des_content').insert(Builder.node('div', {id:'layerblocks'}));
				$('layerblocks').innerHTML = resp.responseText;
				
			},
			onComplete:function(){
				$('onLoadingDes').hide();
			}
			});
	},
	
	bindDesLoyout : function(){
		var li = $("des_loyout").select('li');
		for (var i = 0; i < li.length; ++i) {
			li[i].observe('mouseover', function(evt) {
				new Effect.Opacity(this, {to : 0.7, duration:0.1 });
				Element.addClassName(this, 'current');
			});
			li[i].observe('mouseout', function(evt) {
				new Effect.Opacity(this, { to: 1, duration: 0.1 });
				Element.removeClassName(this, 'current');
			});
			li[i].observe('click', contBuilder.setBaseLoyout.bindAsEventListener(contBuilder, li[i].className) );	
		}
	},
	
	bindDesBut : function(){
		li = $('des_menu').select('span');
		for (var i = 0; i < li.length; ++i){
			li[i].observe('mousemove', function(evt){
				Element.addClassName(this, 'current_over');
			});
			li[i].observe('mouseout', function(evt){
				Element.removeClassName(this, 'current_over');
			});
			li[i].observe('click', function(evt){
				li.each(function(item){	
					if(item.hasClassName('current')){
						item.removeClassName('current');
					}
				});
				$('des_content').childElements().each(function(tis){
					if(tis.visible()){
						tis.hide();
					}
				});
				Element.addClassName(this, 'current');
				contBuilder['_show_' + this.readAttribute('id')]();

			});
		}	
		
	},
	 
	_show_des_but_model :function(){

	},
	_show_des_but_bg : function(){
		if(!contBuilder.isBgShow){
			var params = {};
			params['showGb']='true';
			new Ajax.Request('background.aspx', {
				parameters:params,
				method:'get',
				onLoading:function(){
					$('onLoadingDes').show();
				},
				onSuccess:function(resp){
					var bgform = Builder.node('form', {id:'fr_background', className:'des_page_cont', method:'post', 
								enctype:'multipart/form-data', target:'iform_bg', action:'background.aspx'});
					bgform.innerHTML = resp.responseText;
					$('des_content').insert(bgform);
					$('designer').insert(Builder.node('iframe', {name:'iform_bg', style:'display:none'}));
					$('onLoadingDes').hide();
				},
				onComplete:function(){
					$('onLoadingDes').hide();
					contBuilder.isBgShow = true;
					//$('bg_submit').observe('click', function(evt){
						//$('background').submit();
						
						//evt.stop();
						//$('background').target = 'iform_bg';
						//$('background').action = 'background.ashx';
						//alert($('background'));
						/*
						var params = {};
						var bgcolor = $('bg_color').getValue();
						var file = $('bg_image').getValue();
						params['bgcolor'] = bgcolor;
						params['file'] = file;
						
						alert(bgcolor);
						alert(file);
						new Ajax.Request('background.aspx',{
							contentType :'multipart/form-data',
							parameters:params,
							method:'post',
							onLoading:function(){
							},
							onSuccess:function(){
						
							}
						});
						*/
					//});
				}
			});
			
		}else{
			$('background').show();	
		}
			
	},
	_show_des_but_head:function(){
		if(!contBuilder.isHdShow){
			var params = {};
			params['showPageHeader']='true';
			new Ajax.Request('pageHeader.aspx', {
				parameters:params,
				method:'get',
				onLoading:function(){
					$('onLoadingDes').show();
				},
				onSuccess:function(resp){
					$('des_content').insert(Builder.node('div', {id:'pageheader', className:'des_page_cont'}));
					$('pageheader').innerHTML = resp.responseText;
				
				},
				onComplete:function(){
					$('onLoadingDes').hide();
					contBuilder.isHdShow = true;
				}
			});
		}else{
			$('pageheader').show();
		}
	},
	_show_des_but_vag:function(){
	},
	_show_des_but_block:function(){
		if(!contBuilder.isBlockShow){
			var params = {};
			params['showLayerBlocks']='true';
			new Ajax.Request('layerBlocks.aspx', {
				parameters:params,
				method:'get',
				onLoading:function(){
					$('onLoadingDes').show();
				},
				onSuccess:function(resp){
					$('des_content').insert(Builder.node('div', {id:'layerblocks', className:'des_page_cont'}));
					$('layerblocks').innerHTML = resp.responseText;
				
				},
				onComplete:function(){
					$('onLoadingDes').hide();
					contBuilder.isBlockShow = true;
				}
			});
		}else{
			$('layerblocks').show();
		}
		
	},
	_show_des_but_foot:function(){
	},
	_mousemovefeedback : function(elm){
		if(!this.initialized){
			this._init();
		}
		elm.observe('mouseover', function(evt){
			Element.addClassName(this, 'mosover');
			new Effect.Opacity(this, {to : 0.7, duration:0.1 });
			elm.insert({top: Builder.node('div', {className:'edit_but'}, '编辑')});
		} );
		elm.observe('mouseout', function(evt){
			Element.removeClassName( elm, 'mosover');
			new Effect.Opacity(this, {to : 1, duration:0.1 });
			if( evt.relatedTarget.hasClassName('edit_but') ){	
				this.down('.edit_but').observe('mouseout', function(){
					this.down('.edit_but').remove();
				}.bind(this) );
				this.down('.edit_but').observe('click', function(){
					contBuilder._showEditBox.bindAsEventListener(contBuilder, this.id)();
				}.bind(this) );
			}else{
				this.down('.edit_but').remove();
			}
			
		} );
	},
	
	_showEditBox : function(evt, boxId){
		var boxWindow = Builder.node('div', {id: 'edit_ontent', display:'none', title: boxId} ).insert(
			Builder.node('div', {id: 'edit_size'}).insert(
				Builder.node('span', {className: 'edit_legend'}).insert(
					Builder.node('input', {type: 'radio', name:'edit_type', value: 'edit_size'})
				)
			)
		);
		var topOffset = $(boxId).cumulativeOffset().top - $(boxId).viewportOffset().top + 100 ;
		topOffset_v = topOffset + 'px';
		Modalbox.show(boxWindow, {height: 402, top: topOffset});
	},
	_test : function(){
		//alert($('MB_window').cumulativeOffset().top);
		//alert($('MB_window').viewportOffset().top);
		var topOffset = $('MB_window').cumulativeOffset().top - $('MB_window').viewportOffset().top + 150 ;
		topOffset_v = topOffset + 'px';
		//alert(topOffset_v);
		$('MB_window').setStyle( {top: topOffset_v, fontSize: '14px' } );
	},
	_init : function(){
		_editBut = Builder.node('div', {className:'editBut'}, '编辑');
		this.initialized = true;
	}
};



document.observe('dom:loaded', function() {
    $('showdes').observe('click', function() {
		$('des_content').hide();
        Effect.toggle('designer', 'slide', { afterFinish: function() {
			$(document.body).toggleClassName('bodyDes');
            Effect.toggle('des_content', 'appear');
			if(!contBuilder.isDesButBind){
				contBuilder.bindDesBut();
				
				if(!contBuilder.isDesButBind){
					contBuilder.isDesButBind = true;
				}
			}
			
        } });
    });
	//contBuilder.bindDesBut();
    
	
	
});